<%--
  Created by IntelliJ IDEA.
  User: MyPC
  Date: 2020/1/2
  Time: 11:21
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--
在jsp页面中引入标签库（jstl标签库、struts2标签库）
格式：<%@ taglib uri="标签库地址" prefix="前缀"%>
--%>
<%@ taglib uri="/struts-tags" prefix="s" %>
<%-- 导入css样式 --%>
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/login_style.css">
<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css">
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
<%--
<% %>js脚本片段，其中写的内容会翻译在Servlet的Service方法中;
<％！ 在％>中声明方法，属性和变量;
<％=％>常量jsp表达式，用于在网页上方输出声明的变量或表达式。
--%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<html>
<head>
    <title>图书管理系统</title>
    <script>
        var name = document.getElementById('usernameinput').value;
        var pwd = document.getElementById('passwordinput').value;
        $(document).ready(
            $("#loginbutton").click(function () {
                $.post("AjaxLoginAction", {
                    account: name,
                    password: pwd
                }, function (data) {
                    alert(data);
                    $("#login_warn_tip").html(data);
                }, "json");
            })
        );
    </script>
</head>
<body>
<%--
HTML 可以通过 <div> 和 <span>将元素组合起来
div 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。
元素的另一个常见的用途是文档布局。
span 元素也没有特定的含义。当与 CSS 一同使用时，<span> 元素可用于为部分文本设置样式属性。
详细请参见 https://www.runoob.com/html/html-blocks.html
--%>
<div class="login_welcome">
    <img src="${pageContext.request.contextPath}/image/welcome.jpg" width="1920px" height="945px">
</div>

<div class="login_Chineseword">
      <span>
          书是人类进步的阶梯 -高尔基
      </span>
</div>

<div class="login_Englishword">
      <span>
          <%-- br标签作用为换行，元素是一个空的 HTML 元素。由于关闭标签没有任何意义，因此它没有结束标签。
           详细请参见 https://www.runoob.com/html/html-paragraphs.html--%>
          Books are the stepping stones <br>to human progress. -Gorky
      </span>
</div>

<div class="login_loginform">
    <div class="col-md-4 column">
        <span id="login_labellogin">管理员系统登录</span><br>
        <%-- 用户名输入 --%>
        <div class="form-group">
            <input type="text" class="form-control" id="usernameinput" name="username" placeholder="账户名称"/>
        </div>

        <%-- 密码输入 --%>
        <div class="form-group">
            <input type="password" class="form-control" id="passwordinput" name="password" placeholder="登录密码"/>
        </div>

        <input id="loginbutton" class="btn btn-primary" value="点击登录"/>
        <%-- 只有text标签的文本才能被选择复制 --%>
        <%-- 采用此种做法利用js脚本来设置 --%>
        <text id="login_warn_tip"></text>
    </div>
</div>
</body>
</html>

